<template>
  <div class="toDo">
    <div class="top">
      <div class="invite display-item">
        <el-card shadow="never">
          <el-page-header content="评标邀请">
          </el-page-header>
          <el-table border :data="inviteData">
            <el-table-column  prop="projectName"  show-overflow-tooltip label="项目名"/>
            <el-table-column  prop="projectStatus" label="项目状态" show-overflow-tooltip>
              <template v-slot="scope">
                <el-tag :type="statusTagType(scope.row.projectStatus)" >{{statusShowOptions[scope.row.projectStatus]}}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="projectLocation" show-overflow-tooltip label="评审地点"/>
            <el-table-column prop="projectContact" show-overflow-tooltip label="联系方式"/>
            <el-table-column prop="projectReviewTime" show-overflow-tooltip label="评审时间"/>
            <el-table-column label="操作">
              <template v-slot="scope">
                <el-button type="text" size="mini" @click="openShowProjectDialog(scope.row.id)">查看</el-button>
                <el-button type="text" size="mini" style="color: #67C23A" @click="accept(scope.row.id,1)">接受</el-button>
                <el-button type="text" size="mini" style="color: #F56C6C" @click="accept(scope.row.id,0)">拒绝</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </div>
      <div class="attendance  display-item">
        <el-card shadow="never">
          <el-page-header content="签到">
          </el-page-header>
          <el-table border :data="attendanceDate">
            <el-table-column  prop="projectName"  show-overflow-tooltip label="项目名"/>
            <el-table-column  prop="projectStatus" label="项目状态" show-overflow-tooltip>
              <template v-slot="scope">
                <el-tag :type="statusTagType(scope.row.projectStatus)" >{{statusShowOptions[scope.row.projectStatus]}}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="projectLocation" show-overflow-tooltip label="评审地点"/>
            <el-table-column prop="projectContact" show-overflow-tooltip label="联系方式"/>
            <el-table-column prop="projectReviewTime" show-overflow-tooltip label="评审时间"/>
            <el-table-column label="操作">
              <template v-slot="scope">
                <el-button type="text" size="mini" @click="openShowProjectDialog(scope.row.id)">查看</el-button>
                <el-button type="text" size="mini" style="color: #67C23A" @click="attendance(scope.row.id)">签到</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </div>
    </div>
    <div class="button">
      <div class="score display-item">
        <el-card shadow="never">
          <el-page-header content="待评分项目">
          </el-page-header>
          <el-table border :data="scoreData">
            <el-table-column  prop="projectName"  show-overflow-tooltip label="项目名"/>
            <el-table-column  prop="projectStatus" label="项目状态" show-overflow-tooltip>
              <template v-slot="scope">
                <el-tag :type="statusTagType(scope.row.projectStatus)" >{{statusShowOptions[scope.row.projectStatus]}}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="projectLocation" show-overflow-tooltip label="评审地点"/>
            <el-table-column prop="projectContact" show-overflow-tooltip label="联系方式"/>
            <el-table-column prop="projectReviewTime" show-overflow-tooltip label="评审时间"/>
            <el-table-column label="操作">
              <template v-slot="scope">
                <el-button type="text" size="mini" @click="openShowProjectDialog(scope.row.id)">查看</el-button>
                <el-button type="text" size="mini" style="color: #67C23A" @click="$router.push('/project/score')">去评分</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </div>
    </div>
    <ShowProject/>
  </div>
</template>
<script>
import { acceptInvite, attendance, initAttendanceDate, initInviteData, toScore } from '@/request/todo/todo-api'
import ShowProject from '@/components/Project/ShowProject.vue'
import store from '@/store'
import router from '@/router'

export default {
  components:{
    ShowProject
  },
  created () {
    this.initInviteData()
    this.initAttendanceDate()
    this.initToScore()
  },
  data(){
    return{
      inviteData:[],
      attendanceDate:[],
      scoreData:[],
      statusOptions:[
        {value:'0',label:'已登记'},
        {value:'1',label:'已设置条件,未抽取'},
        {value:'2',label:'已抽取'},
        {value:'3',label:'待评审'},
        {value:'4',label:'已评审'},
        {value:'5',label:'抽取失败'},
        {value:'6',label:'已取消'},
      ],
      statusShowOptions:['已登记','已设置条件,未抽取','已抽取','待评审','已评审','抽取失败','已取消'],
      statusTagTypes:['','','warning','warning','success','danger','info'],
    }
  },methods:{
    router () {
      return router
    },
    refresh(){
      this.initInviteData()
      this.initAttendanceDate()
      this.initToScore()
    },
    //打开展示项目信息
    openShowProjectDialog(id){
      store.commit('ProjectEdit/changeShowProjectId',id)
      store.commit('ProjectEdit/changeShowProjectSync',true)
    },
    //返回状态的标签样式
    statusTagType(status){
      return  this.statusTagTypes[status]
    },
    async initInviteData () {
      let res = await initInviteData()
      if (res&&res.code===200){
        this.inviteData=res.data
      }else{
        this.$message.error("查询邀请信息失败")
      }
    },
    async initAttendanceDate () {
      let res = await initAttendanceDate()
      if (res&&res.code===200){
        this.attendanceDate=res.data
      }else{
        this.$message.error("查询邀请信息失败")
      }
    },
    async initToScore () {
      let res = await toScore()
      if (res&&res.code===200){
        this.scoreData=res.data
      }else{
        this.$message.error("查询项目评分信息失败")
      }
    },
    async accept(id,accept){
      const param = {
        id: id,
        accept: accept
      }
      if (accept===0){
        this.$confirm('确定取消该项目评审吗？', '提示', {
          'confirmButtonText': '确定',
          'cancelButtonText': '取消',
          'type': 'warning'
        }).then(async () => {
          let res = await acceptInvite(param)
          if (res && res.code === 200) {
            this.refresh()
            this.$message.success("处理邀请成功")
          } else {
            this.$message.error("处理邀请失败")
          }
        }).catch(()=>{
        })
      }else {
        let res = await acceptInvite(param)
        if (res && res.code === 200) {
          this.refresh()
          this.$message.success("处理邀请成功")
        } else {
          this.$message.error("处理邀请失败")
        }
      }


    },
    attendance(projectId){
      this.$prompt('请输入签到码', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      }).then(async ({ value }) => {
        if (value) {
          const param={projectId:projectId,value:value}
          let res = await attendance(param)
          if (res&&res.code===200){
            this.$message.success("签到成功")
            this.refresh()
          }else {
            this.$message.error(res.msg?res.msg:"签到失败")
          }
        } else {
          this.$message.error("请输入签到码!")
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消输入'
        });
      });
    },
  }
}
</script>
<style scoped lang="less">
.toDo {
.top{
  display: flex;
  .display-item {
    width: 100%;
    margin: 20px;
    .el-card {
      height: 300px;
    }
  }
}
.button{
  margin: 20px;
  .display-item{
    .el-card{
      height: 400px;
    }
  }

}

}

/deep/.el-page-header{
  margin-bottom: 10px!important;
}
/deep/ .el-page-header__left {
  display: none !important;

}
</style>
